main.js ➔ Event - Code Metrics - Inspection of "Don't draw new events when the tab isn't active" - ekinhbayar/gitamp - Measure and Improve Code Quality continuously with Scrutinizer

Completed

Push — master ( 9fa866...b60087 )

by Pieter

created 2017-01-08 14:51 UTC

main.js ➔ Event A

↳ Parent: Gui.constructor

Complexity

Conditions	1
Paths	1

Size

Total Lines

Duplication

Lines	0
Ratio	0 %

Importance

Changes	1
Bugs	0	Features	0

Metric	Value
cc	1
c	1
b	0
f	0
nc	1
nop	2
dl	0
loc	4
rs	10

const GitAmp = (function(exports, $) {
    'use strict';

    /**
     * AudioPlayer
     */
    const AudioPlayer = (function() {
        // something somewhere needs a global volume variable
        // not sure what thing it is, but adding this line works
        exports.volume = 0.6;

        const maxPitch = 100.0;
        const logUsed  = 1.0715307808111486871978099;

        const maximumSimultaneousNotes = 2;
        const soundLength = 300;

        function AudioPlayer() {
            this.currentlyPlayingSounds = 0;

            this.sounds = {
                celesta: this.initializeCelesta(),
                clav: this.initializeClav(),
                swells: this.initializeSwells()
            };

            //noinspection JSUnresolvedVariable
            exports.Howler.volume(0.7);
        }

        AudioPlayer.prototype.initializeCelesta = function() {
            const sounds = [];

            for (let i = 1; i <= 24; i++) {
                let filename = (i > 9) ? 'c0' + i : 'c00' + i;

                //noinspection JSUnresolvedFunction
                sounds.push(new Howl({

                    src : [
                        'https://d1fz9d31zqor6x.cloudfront.net/sounds/celesta/' + filename + '.ogg',
                        'https://d1fz9d31zqor6x.cloudfront.net/sounds/celesta/' + filename + '.mp3'
                    ],
                    volume : 0.7,
                    buffer: true
                }));
            }

            return sounds;
        };

        AudioPlayer.prototype.initializeClav = function() {
            const sounds = [];

            for (let i = 1; i <= 24; i++) {
                let filename = (i > 9) ? 'c0' + i : 'c00' + i;

                //noinspection JSUnresolvedFunction
                sounds.push(new Howl({

                    src : [
                        'https://d1fz9d31zqor6x.cloudfront.net/sounds/clav/' + filename + '.ogg',
                        'https://d1fz9d31zqor6x.cloudfront.net/sounds/clav/' + filename + '.mp3'
                    ],
                    volume : 0.7,
                    buffer: true
                }));
            }

            return sounds;
        };

        AudioPlayer.prototype.initializeSwells = function() {
            const sounds = [];

            for (let i = 1; i <= 3; i++) {
                //noinspection JSUnresolvedFunction
                sounds.push(new Howl({

                    src : [
                        'https://d1fz9d31zqor6x.cloudfront.net/sounds/swells/swell' + i + '.ogg',
                        'https://d1fz9d31zqor6x.cloudfront.net/sounds/swells/swell' + i + '.mp3'
                    ],
                    volume : 0.7,
                    buffer: true
                }));
            }

            return sounds;
        };

        AudioPlayer.prototype.getSoundIndex = function(size, type) {
            const pitch = 100 - Math.min(maxPitch, Math.log(size + logUsed) / Math.log(logUsed));
            let index   = Math.floor(pitch / 100.0 * this.sounds[type].length);

            index += Math.floor(Math.random() * 4) - 2;
            index = Math.min(this.sounds[type].length - 1, index);
            index = Math.max(1, index);

            return index;
        };

        AudioPlayer.prototype.playSound = function(sound) {
            if (this.currentlyPlayingSounds >= maximumSimultaneousNotes) {
                return;
            }

            sound.play();

            this.currentlyPlayingSounds++;

            setTimeout(function() {
                this.currentlyPlayingSounds--;
            }.bind(this), soundLength);
        };

        AudioPlayer.prototype.playCelesta = function(size) {
            this.playSound(this.sounds.celesta[this.getSoundIndex(size, 'celesta')]);
        };

        AudioPlayer.prototype.playClav = function(size) {
            this.playSound(this.sounds.clav[this.getSoundIndex(size, 'clav')]);
        };

        AudioPlayer.prototype.playSwell = function() {
            this.playSound(this.sounds.swells[Math.round(Math.random() * (this.sounds.swells.length - 1))]);
        };

        return AudioPlayer;
    }());

    /**
     * Gui
     */
    const Gui = (function() {
        const scaleFactor = 6;
        const textColor   = '#ffffff';
        const maxLife     = 20000;

        function Event(event, svg) {
            this.event = event;
            this.svg   = svg;
        }

        Event.prototype.getSize = function() {
            return Math.max(Math.sqrt(Math.abs(this.event.getMessage().length)) * scaleFactor, 3);
        };

        Event.prototype.getText = function() {
            switch(this.event.getType()){

                case 'PushEvent':
                    return this.event.getActorName() + ' pushed to ' + this.event.getRepositoryName();
                case 'PullRequestEvent':
                    return this.event.getActorName() + ' ' + this.event.getAction() + ' ' + ' a PR for ' + this.event.getRepositoryName();
                case 'IssuesEvent':
                    return this.event.getActorName() + ' ' + this.event.getAction() + ' an issue in ' + this.event.getRepositoryName();
                case 'IssueCommentEvent':
                    return this.event.getActorName() + ' commented in ' + this.event.getRepositoryName();
                case 'ForkEvent':
                    return this.event.getActorName() + ' forked ' + this.event.getRepositoryName();
                case 'CreateEvent':
                    return this.event.getActorName() + ' created ' + this.event.getRepositoryName();
                case 'WatchEvent':
                    return this.event.getActorName() + ' watched ' + this.event.getRepositoryName();
            }

        };

        Event.prototype.getBackgroundColor = function() {
            switch(this.event.getType()){

                case 'PushEvent':
                    return '#22B65D';
                case 'PullRequestEvent':
                    return '#8F19BB';
                case 'IssuesEvent':
                    return '#ADD913';
                case 'IssueCommentEvent':
                    return '#FF4901';
                case 'ForkEvent':
                    return '#0184FF';
                case 'CreateEvent':
                    return '#00C0C0';
                case 'WatchEvent':
                    return '#E60062';
            }

        };

        Event.prototype.getRingAnimationDuration = function() {
            if (this.event.getType() === 'PullRequestEvent') {
                return 10000;
            }

            return 3000;
        };

        Event.prototype.getRingRadius = function() {
            if (this.event.getType() === 'PullRequestEvent') {
                return 600;
            }

            return 80;
        };

        Event.prototype.draw = function(width, height) {
            let no_label = false;

            let size     = this.getSize();

            const self = this;

            //noinspection JSUnresolvedFunction
            Math.seedrandom(this.event.getMessage());
            let x = Math.random() * (width - size) + size;
            let y = Math.random() * (height - size) + size;

            let circle_group = this.svg.append('g')
                .attr('transform', 'translate(' + x + ', ' + y + ')')
                .attr('fill', this.getBackgroundColor())
                .style('opacity', 1);

            let ring = circle_group.append('circle');
            ring.attr({r: size, stroke: 'none'});
            ring.transition()
                .attr('r', size + this.getRingRadius())
                .style('opacity', 0)
                .ease(Math.sqrt)
                .duration(this.getRingAnimationDuration())
                .remove();

            let circle_container = circle_group.append('a');
            circle_container.attr('xlink:href', this.event.getUrl());
            circle_container.attr('target', '_blank');
            circle_container.attr('fill', textColor);

            let circle = circle_container.append('circle');
            circle.classed(this.event.getType(), true);
            circle.attr('r', size)
                .attr('fill', this.getBackgroundColor())
                .transition()
                .duration(maxLife)
                .style('opacity', 0)
                .remove();

            circle_container.on('mouseover', function() {
                circle_container.append('text')
                    .text(self.getText())
                    .classed('label', true)
                    .attr('text-anchor', 'middle')
                    .attr('font-size', '0.8em')
                    .transition()
                    .delay(1000)
                    .style('opacity', 0)
                    .duration(2000)
                    .each(function() { no_label = true; })

                    .remove();
            });

            circle_container.append('text')
                .text(this.getText())
                .classed('article-label', true)
                .attr('text-anchor', 'middle')
                .attr('font-size', '0.8em')
                .transition()
                .delay(2000)
                .style('opacity', 0)
                .duration(5000)
                .each(function() { no_label = true; })

                .remove();
        };

        function Gui() {
            //noinspection JSUnresolvedVariable
            this.svg = exports.d3.select('#area').append('svg');

            exports.addEventListener('resize', this.resize.bind(this));

            this.setupVolumeSlider();
            this.resize();
        }

        Gui.prototype.setupVolumeSlider = function() {
            //noinspection JSUnresolvedFunction
            $('#volumeSlider').slider({
                max: 100,
                min: 0,
                value: volume * 100,

                slide: function (event, ui) {
                    //noinspection JSUnresolvedVariable
                    exports.Howler.volume(ui.value/100.0);
                },
                change: function (event, ui) {
                    //noinspection JSUnresolvedVariable
                    exports.Howler.volume(ui.value/100.0);
                }
            });
        };

        Gui.prototype.getWidth = function() {
            return exports.innerWidth;
        };

        Gui.prototype.getHeight = function() {
            return exports.innerHeight - $('header').height();
        };

        Gui.prototype.resize = function() {
            this.svg.attr('width', this.getWidth());
            this.svg.attr('height', this.getHeight());
        };

        Gui.prototype.drawEvent = function(event) {
            if (document.hidden) {
                return;
            }

            new Event(event, this.svg).draw(this.getWidth(), this.getHeight());

            // Remove HTML of decayed events
            // Keep it less than 50
            let $area = $('#area');
            if($area.find('svg g').length > 50){
                $area.find('svg g:lt(10)').remove();
            }
        };

        return Gui;
    }());

    /**
     * ConnectedUsersMessage
     */
    function ConnectedUsersMessage(response) {
        //noinspection JSUnresolvedVariable
        this.count = response.connectedUsers;
    }

    ConnectedUsersMessage.prototype.getCount = function() {
        return this.count;
    };

    /**
     * EventMessage
     */
    function EventMessage(event) {
        this.event = event;
    }

    EventMessage.prototype.getId = function() {
        //noinspection JSUnresolvedVariable
        return this.event.id;
    };

    EventMessage.prototype.getType = function() {
        //noinspection JSUnresolvedVariable
        return this.event.type;
    };

    EventMessage.prototype.getAction = function() {
        //noinspection JSUnresolvedVariable
        return this.event.action;
    };

    EventMessage.prototype.getRepositoryName = function() {
        //noinspection JSUnresolvedVariable
        return this.event.repoName;
    };

    EventMessage.prototype.getActorName = function() {
        //noinspection JSUnresolvedVariable
        return this.event.actorName;
    };

    EventMessage.prototype.getUrl = function() {
        //noinspection JSUnresolvedVariable
        return this.event.eventUrl;
    };

    EventMessage.prototype.getMessage = function() {
        //noinspection JSUnresolvedVariable
        return this.event.message;
    };

    /**
     * EventMessageCollection
     */
    function EventMessageCollection(response) {
        this.events = [];

        for (let i = 0; i < response.length; i++) {
            this.events.push(new EventMessage(response[i]));
        }
    }

    EventMessageCollection.prototype.forEach = function(callback) {
        for (let i = 0; i < this.events.length; i++) {
            callback(this.events[i]);
        }
    };

    /**
     * EventMessagesFactory
     */
    function EventMessagesFactory () {
    }

    EventMessagesFactory.prototype.build = function(response) {
        const parsedResponse = JSON.parse(response.data);

        if (parsedResponse.hasOwnProperty('connectedUsers')) {
            return new ConnectedUsersMessage(parsedResponse);
        }

        return new EventMessageCollection(parsedResponse);
    };

    /**
     * EventQueue
     */
    function EventQueue() {
        this.queue = [];
    }

    EventQueue.prototype.append = function(eventMessages) {
        eventMessages.forEach(function(event) {
            if (this.exists(event)) {
                return;
            }

            this.queue.push(event);
        }.bind(this));

        if (this.queue.length > 1000) {
            this.queue = this.queue.slice(0, 1000);
        }
    };

    EventQueue.prototype.exists = function(event) {
        for (let i = 0; i < this.queue.length; i++) {
            if (event.getId() === this.queue[i].getId()) {
                return true;
            }
        }

        return false;
    };

    EventQueue.prototype.get = function() {
        return this.queue.shift();
    };

    EventQueue.prototype.count = function() {
        return this.queue.length;
    };

    /**
     * Connection
     */
    function Connection(eventMessageFactory) {
        this.eventMessageFactory = eventMessageFactory;

        this.connection = null;
        this.handlers   = [];
    }

    Connection.prototype.start = function() {
        let protocol = 'ws://';

        if (exports.location.protocol === "https:") {
            protocol = 'wss://';
        }

        this.connection = new WebSocket(protocol + exports.location.host + '/ws');


        this.connection.addEventListener('message', this.handleMessage.bind(this));
        this.connection.addEventListener('open', this.handleOpen.bind(this));
        this.connection.addEventListener('close', this.handleClose.bind(this));
        this.connection.addEventListener('error', this.handleError.bind(this));
    };

    Connection.prototype.registerHandler = function(handler) {
        this.handlers.push(handler);
    };

    Connection.prototype.handleMessage = function(response) {
        const message = this.eventMessageFactory.build(response);

        for (let i = 0; i < this.handlers.length; i++) {
            this.handlers[i](message);
        }
    };

    Connection.prototype.handleOpen = function() {
        const elements = document.querySelectorAll('.events-remaining-text, .events-remaining-value, .online-users-div');

        for (let i = 0; i < elements.length; i++) {
            elements[i].style.visibility = 'visible';
        }
    };

    Connection.prototype.handleClose = function() {
        this.connection = null;
    };

    Connection.prototype.handleError = function() {
        this.handleClose();

        const reTryInterval = setInterval(function() {
            if (this.connection !== null) {
                clearInterval(reTryInterval);

                return;
            }

            this.start();
        }.bind(this), 5000);
    };

    /**
     * Application
     */
    function Application() {
        this.queue = new EventQueue();
        this.audio = new AudioPlayer();
        this.gui   = new Gui();
    }

    Application.prototype.run = function() {
        const connection = new Connection(new EventMessagesFactory());

        connection.registerHandler(this.process.bind(this));

        connection.start();

        this.loop();
    };

    Application.prototype.process = function(message) {
        if (message instanceof ConnectedUsersMessage) {
            document.getElementsByClassName('online-users-count')[0].textContent = message.getCount();

            return;
        }

        this.queue.append(message);
    };

    Application.prototype.loop = function() {
        setTimeout(function() {
            this.processEvent(this.queue.get());

            document.getElementsByClassName('events-remaining-value')[0].textContent = this.queue.count();

            this.loop();
        }.bind(this), Math.floor(Math.random() * 1000) + 500);
    };

    Application.prototype.processEvent = function(event) {
        if (!event.getMessage()) {
            return;
        }

        if (event.getType() === 'IssuesEvent' || event.getType() === 'IssueCommentEvent') {
            this.audio.playClav(event.getMessage().length * 1.1);
        } else if(event.getType() === 'PushEvent') {
            this.audio.playCelesta(event.getMessage().length * 1.1);
        }else{
            this.audio.playSwell();
        }

        this.gui.drawEvent(event);
    };

    return Application;
}(window, jQuery));

$(function() {
    new GitAmp().run();
});


1			const GitAmp = (function(exports, $) {
2			'use strict';
3
4			/**
5			* AudioPlayer
6			*/
7			const AudioPlayer = (function() {
8			// something somewhere needs a global volume variable
9			// not sure what thing it is, but adding this line works
10			exports.volume = 0.6;
11
12			const maxPitch = 100.0;
13			const logUsed = 1.0715307808111486871978099;
14
15			const maximumSimultaneousNotes = 2;
16			const soundLength = 300;
17
18			function AudioPlayer() {
19			this.currentlyPlayingSounds = 0;
20
21			this.sounds = {
22			celesta: this.initializeCelesta(),
23			clav: this.initializeClav(),
24			swells: this.initializeSwells()
25			};
26
27			//noinspection JSUnresolvedVariable
28			exports.Howler.volume(0.7);
29			}
30
31			AudioPlayer.prototype.initializeCelesta = function() {
32			const sounds = [];
33
34			for (let i = 1; i <= 24; i++) {
35			let filename = (i > 9) ? 'c0' + i : 'c00' + i;
36
37			//noinspection JSUnresolvedFunction
38			sounds.push(new Howl({
			0 ignored issues – show Bug introduced 2017-01-07 19:57 UTC by Report Bug Copy Issue Report The variable `Howl` seems to be never declared. If this is a global, consider adding a `/** global: Howl */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
39			src : [
40			'https://d1fz9d31zqor6x.cloudfront.net/sounds/celesta/' + filename + '.ogg',
41			'https://d1fz9d31zqor6x.cloudfront.net/sounds/celesta/' + filename + '.mp3'
42			],
43			volume : 0.7,
44			buffer: true
45			}));
46			}
47
48			return sounds;
49			};
50
51			AudioPlayer.prototype.initializeClav = function() {
52			const sounds = [];
53
54			for (let i = 1; i <= 24; i++) {
55			let filename = (i > 9) ? 'c0' + i : 'c00' + i;
56
57			//noinspection JSUnresolvedFunction
58			sounds.push(new Howl({
			0 ignored issues – show Bug introduced 2017-01-07 19:57 UTC by Report Bug Copy Issue Report The variable `Howl` seems to be never declared. If this is a global, consider adding a `/** global: Howl */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
59			src : [
60			'https://d1fz9d31zqor6x.cloudfront.net/sounds/clav/' + filename + '.ogg',
61			'https://d1fz9d31zqor6x.cloudfront.net/sounds/clav/' + filename + '.mp3'
62			],
63			volume : 0.7,
64			buffer: true
65			}));
66			}
67
68			return sounds;
69			};
70
71			AudioPlayer.prototype.initializeSwells = function() {
72			const sounds = [];
73
74			for (let i = 1; i <= 3; i++) {
75			//noinspection JSUnresolvedFunction
76			sounds.push(new Howl({
			0 ignored issues – show Bug introduced 2017-01-07 19:57 UTC by Report Bug Copy Issue Report The variable `Howl` seems to be never declared. If this is a global, consider adding a `/** global: Howl */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
77			src : [
78			'https://d1fz9d31zqor6x.cloudfront.net/sounds/swells/swell' + i + '.ogg',
79			'https://d1fz9d31zqor6x.cloudfront.net/sounds/swells/swell' + i + '.mp3'
80			],
81			volume : 0.7,
82			buffer: true
83			}));
84			}
85
86			return sounds;
87			};
88
89			AudioPlayer.prototype.getSoundIndex = function(size, type) {
90			const pitch = 100 - Math.min(maxPitch, Math.log(size + logUsed) / Math.log(logUsed));
91			let index = Math.floor(pitch / 100.0 * this.sounds[type].length);
92
93			index += Math.floor(Math.random() * 4) - 2;
94			index = Math.min(this.sounds[type].length - 1, index);
95			index = Math.max(1, index);
96
97			return index;
98			};
99
100			AudioPlayer.prototype.playSound = function(sound) {
101			if (this.currentlyPlayingSounds >= maximumSimultaneousNotes) {
102			return;
103			}
104
105			sound.play();
106
107			this.currentlyPlayingSounds++;
108
109			setTimeout(function() {
110			this.currentlyPlayingSounds--;
111			}.bind(this), soundLength);
112			};
113
114			AudioPlayer.prototype.playCelesta = function(size) {
115			this.playSound(this.sounds.celesta[this.getSoundIndex(size, 'celesta')]);
116			};
117
118			AudioPlayer.prototype.playClav = function(size) {
119			this.playSound(this.sounds.clav[this.getSoundIndex(size, 'clav')]);
120			};
121
122			AudioPlayer.prototype.playSwell = function() {
123			this.playSound(this.sounds.swells[Math.round(Math.random() * (this.sounds.swells.length - 1))]);
124			};
125
126			return AudioPlayer;
127			}());
128
129			/**
130			* Gui
131			*/
132			const Gui = (function() {
133			const scaleFactor = 6;
134			const textColor = '#ffffff';
135			const maxLife = 20000;
136
137			function Event(event, svg) {
138			this.event = event;
139			this.svg = svg;
140			}
141
142			Event.prototype.getSize = function() {
143			return Math.max(Math.sqrt(Math.abs(this.event.getMessage().length)) * scaleFactor, 3);
144			};
145
146			Event.prototype.getText = function() {
147			switch(this.event.getType()){
			0 ignored issues – show Coding Style introduced 2017-01-07 19:57 UTC by Report Bug Copy Issue Report As per coding-style, `switch` statements should have a `default` case. Loading history...
148			case 'PushEvent':
149			return this.event.getActorName() + ' pushed to ' + this.event.getRepositoryName();
150			case 'PullRequestEvent':
151			return this.event.getActorName() + ' ' + this.event.getAction() + ' ' + ' a PR for ' + this.event.getRepositoryName();
152			case 'IssuesEvent':
153			return this.event.getActorName() + ' ' + this.event.getAction() + ' an issue in ' + this.event.getRepositoryName();
154			case 'IssueCommentEvent':
155			return this.event.getActorName() + ' commented in ' + this.event.getRepositoryName();
156			case 'ForkEvent':
157			return this.event.getActorName() + ' forked ' + this.event.getRepositoryName();
158			case 'CreateEvent':
159			return this.event.getActorName() + ' created ' + this.event.getRepositoryName();
160			case 'WatchEvent':
161			return this.event.getActorName() + ' watched ' + this.event.getRepositoryName();
162			}
			0 ignored issues – show Comprehensibility introduced 2017-01-08 14:53 UTC by Report Bug Copy Issue Report There is no `default` case in this switch, so nothing gets returned when all cases fail. You might want to consider adding a `default` or `return undefined` explicitly. Loading history...
163			};
164
165			Event.prototype.getBackgroundColor = function() {
166			switch(this.event.getType()){
			0 ignored issues – show Coding Style introduced 2017-01-08 14:53 UTC by Report Bug Copy Issue Report As per coding-style, `switch` statements should have a `default` case. Loading history...
167			case 'PushEvent':
168			return '#22B65D';
169			case 'PullRequestEvent':
170			return '#8F19BB';
171			case 'IssuesEvent':
172			return '#ADD913';
173			case 'IssueCommentEvent':
174			return '#FF4901';
175			case 'ForkEvent':
176			return '#0184FF';
177			case 'CreateEvent':
178			return '#00C0C0';
179			case 'WatchEvent':
180			return '#E60062';
181			}
			0 ignored issues – show Comprehensibility introduced 2017-01-08 14:53 UTC by Report Bug Copy Issue Report There is no `default` case in this switch, so nothing gets returned when all cases fail. You might want to consider adding a `default` or `return undefined` explicitly. Loading history...
182			};
183
184			Event.prototype.getRingAnimationDuration = function() {
185			if (this.event.getType() === 'PullRequestEvent') {
186			return 10000;
187			}
188
189			return 3000;
190			};
191
192			Event.prototype.getRingRadius = function() {
193			if (this.event.getType() === 'PullRequestEvent') {
194			return 600;
195			}
196
197			return 80;
198			};
199
200			Event.prototype.draw = function(width, height) {
201			let no_label = false;
			0 ignored issues – show Unused Code introduced 2017-01-05 16:55 UTC by Report Bug Copy Issue Report The variable `no_label` seems to be never used. Consider removing it. Loading history...
202			let size = this.getSize();
203
204			const self = this;
205
206			//noinspection JSUnresolvedFunction
207			Math.seedrandom(this.event.getMessage());
208			let x = Math.random() * (width - size) + size;
209			let y = Math.random() * (height - size) + size;
210
211			let circle_group = this.svg.append('g')
212			.attr('transform', 'translate(' + x + ', ' + y + ')')
213			.attr('fill', this.getBackgroundColor())
214			.style('opacity', 1);
215
216			let ring = circle_group.append('circle');
217			ring.attr({r: size, stroke: 'none'});
218			ring.transition()
219			.attr('r', size + this.getRingRadius())
220			.style('opacity', 0)
221			.ease(Math.sqrt)
222			.duration(this.getRingAnimationDuration())
223			.remove();
224
225			let circle_container = circle_group.append('a');
226			circle_container.attr('xlink:href', this.event.getUrl());
227			circle_container.attr('target', '_blank');
228			circle_container.attr('fill', textColor);
229
230			let circle = circle_container.append('circle');
231			circle.classed(this.event.getType(), true);
232			circle.attr('r', size)
233			.attr('fill', this.getBackgroundColor())
234			.transition()
235			.duration(maxLife)
236			.style('opacity', 0)
237			.remove();
238
239			circle_container.on('mouseover', function() {
240			circle_container.append('text')
241			.text(self.getText())
242			.classed('label', true)
243			.attr('text-anchor', 'middle')
244			.attr('font-size', '0.8em')
245			.transition()
246			.delay(1000)
247			.style('opacity', 0)
248			.duration(2000)
249			.each(function() { no_label = true; })
			0 ignored issues – show Unused Code introduced 2017-01-08 13:53 UTC by Report Bug Copy Issue Report The variable `no_label` seems to be never used. Consider removing it. Loading history...
250			.remove();
251			});
252
253			circle_container.append('text')
254			.text(this.getText())
255			.classed('article-label', true)
256			.attr('text-anchor', 'middle')
257			.attr('font-size', '0.8em')
258			.transition()
259			.delay(2000)
260			.style('opacity', 0)
261			.duration(5000)
262			.each(function() { no_label = true; })
			0 ignored issues – show Unused Code introduced 2017-01-05 16:55 UTC by Report Bug Copy Issue Report The variable `no_label` seems to be never used. Consider removing it. Loading history...
263			.remove();
264			};
265
266			function Gui() {
267			//noinspection JSUnresolvedVariable
268			this.svg = exports.d3.select('#area').append('svg');
269
270			exports.addEventListener('resize', this.resize.bind(this));
271
272			this.setupVolumeSlider();
273			this.resize();
274			}
275
276			Gui.prototype.setupVolumeSlider = function() {
277			//noinspection JSUnresolvedFunction
278			$('#volumeSlider').slider({
279			max: 100,
280			min: 0,
281			value: volume * 100,
			0 ignored issues – show Bug introduced 2017-01-08 13:53 UTC by Report Bug Copy Issue Report The variable `volume` seems to be never declared. If this is a global, consider adding a `/** global: volume */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
282			slide: function (event, ui) {
283			//noinspection JSUnresolvedVariable
284			exports.Howler.volume(ui.value/100.0);
285			},
286			change: function (event, ui) {
287			//noinspection JSUnresolvedVariable
288			exports.Howler.volume(ui.value/100.0);
289			}
290			});
291			};
292
293			Gui.prototype.getWidth = function() {
294			return exports.innerWidth;
295			};
296
297			Gui.prototype.getHeight = function() {
298			return exports.innerHeight - $('header').height();
299			};
300
301			Gui.prototype.resize = function() {
302			this.svg.attr('width', this.getWidth());
303			this.svg.attr('height', this.getHeight());
304			};
305
306			Gui.prototype.drawEvent = function(event) {
307			if (document.hidden) {
308			return;
309			}
310
311			new Event(event, this.svg).draw(this.getWidth(), this.getHeight());
312
313			// Remove HTML of decayed events
314			// Keep it less than 50
315			let $area = $('#area');
316			if($area.find('svg g').length > 50){
317			$area.find('svg g:lt(10)').remove();
318			}
319			};
320
321			return Gui;
322			}());
323
324			/**
325			* ConnectedUsersMessage
326			*/
327			function ConnectedUsersMessage(response) {
328			//noinspection JSUnresolvedVariable
329			this.count = response.connectedUsers;
330			}
331
332			ConnectedUsersMessage.prototype.getCount = function() {
333			return this.count;
334			};
335
336			/**
337			* EventMessage
338			*/
339			function EventMessage(event) {
340			this.event = event;
341			}
342
343			EventMessage.prototype.getId = function() {
344			//noinspection JSUnresolvedVariable
345			return this.event.id;
346			};
347
348			EventMessage.prototype.getType = function() {
349			//noinspection JSUnresolvedVariable
350			return this.event.type;
351			};
352
353			EventMessage.prototype.getAction = function() {
354			//noinspection JSUnresolvedVariable
355			return this.event.action;
356			};
357
358			EventMessage.prototype.getRepositoryName = function() {
359			//noinspection JSUnresolvedVariable
360			return this.event.repoName;
361			};
362
363			EventMessage.prototype.getActorName = function() {
364			//noinspection JSUnresolvedVariable
365			return this.event.actorName;
366			};
367
368			EventMessage.prototype.getUrl = function() {
369			//noinspection JSUnresolvedVariable
370			return this.event.eventUrl;
371			};
372
373			EventMessage.prototype.getMessage = function() {
374			//noinspection JSUnresolvedVariable
375			return this.event.message;
376			};
377
378			/**
379			* EventMessageCollection
380			*/
381			function EventMessageCollection(response) {
382			this.events = [];
383
384			for (let i = 0; i < response.length; i++) {
385			this.events.push(new EventMessage(response[i]));
386			}
387			}
388
389			EventMessageCollection.prototype.forEach = function(callback) {
390			for (let i = 0; i < this.events.length; i++) {
391			callback(this.events[i]);
392			}
393			};
394
395			/**
396			* EventMessagesFactory
397			*/
398			function EventMessagesFactory () {
399			}
400
401			EventMessagesFactory.prototype.build = function(response) {
402			const parsedResponse = JSON.parse(response.data);
403
404			if (parsedResponse.hasOwnProperty('connectedUsers')) {
405			return new ConnectedUsersMessage(parsedResponse);
406			}
407
408			return new EventMessageCollection(parsedResponse);
409			};
410
411			/**
412			* EventQueue
413			*/
414			function EventQueue() {
415			this.queue = [];
416			}
417
418			EventQueue.prototype.append = function(eventMessages) {
419			eventMessages.forEach(function(event) {
420			if (this.exists(event)) {
421			return;
422			}
423
424			this.queue.push(event);
425			}.bind(this));
426
427			if (this.queue.length > 1000) {
428			this.queue = this.queue.slice(0, 1000);
429			}
430			};
431
432			EventQueue.prototype.exists = function(event) {
433			for (let i = 0; i < this.queue.length; i++) {
434			if (event.getId() === this.queue[i].getId()) {
435			return true;
436			}
437			}
438
439			return false;
440			};
441
442			EventQueue.prototype.get = function() {
443			return this.queue.shift();
444			};
445
446			EventQueue.prototype.count = function() {
447			return this.queue.length;
448			};
449
450			/**
451			* Connection
452			*/
453			function Connection(eventMessageFactory) {
454			this.eventMessageFactory = eventMessageFactory;
455
456			this.connection = null;
457			this.handlers = [];
458			}
459
460			Connection.prototype.start = function() {
461			let protocol = 'ws://';
462
463			if (exports.location.protocol === "https:") {
464			protocol = 'wss://';
465			}
466
467			this.connection = new WebSocket(protocol + exports.location.host + '/ws');
			0 ignored issues – show Bug introduced 2017-01-07 19:57 UTC by Report Bug Copy Issue Report The variable `WebSocket` seems to be never declared. If this is a global, consider adding a `/** global: WebSocket */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
468
469			this.connection.addEventListener('message', this.handleMessage.bind(this));
470			this.connection.addEventListener('open', this.handleOpen.bind(this));
471			this.connection.addEventListener('close', this.handleClose.bind(this));
472			this.connection.addEventListener('error', this.handleError.bind(this));
473			};
474
475			Connection.prototype.registerHandler = function(handler) {
476			this.handlers.push(handler);
477			};
478
479			Connection.prototype.handleMessage = function(response) {
480			const message = this.eventMessageFactory.build(response);
481
482			for (let i = 0; i < this.handlers.length; i++) {
483			this.handlers[i](message);
484			}
485			};
486
487			Connection.prototype.handleOpen = function() {
488			const elements = document.querySelectorAll('.events-remaining-text, .events-remaining-value, .online-users-div');
489
490			for (let i = 0; i < elements.length; i++) {
491			elements[i].style.visibility = 'visible';
492			}
493			};
494
495			Connection.prototype.handleClose = function() {
496			this.connection = null;
497			};
498
499			Connection.prototype.handleError = function() {
500			this.handleClose();
501
502			const reTryInterval = setInterval(function() {
503			if (this.connection !== null) {
504			clearInterval(reTryInterval);
505
506			return;
507			}
508
509			this.start();
510			}.bind(this), 5000);
511			};
512
513			/**
514			* Application
515			*/
516			function Application() {
517			this.queue = new EventQueue();
518			this.audio = new AudioPlayer();
519			this.gui = new Gui();
520			}
521
522			Application.prototype.run = function() {
523			const connection = new Connection(new EventMessagesFactory());
524
525			connection.registerHandler(this.process.bind(this));
526
527			connection.start();
528
529			this.loop();
530			};
531
532			Application.prototype.process = function(message) {
533			if (message instanceof ConnectedUsersMessage) {
534			document.getElementsByClassName('online-users-count')[0].textContent = message.getCount();
535
536			return;
537			}
538
539			this.queue.append(message);
540			};
541
542			Application.prototype.loop = function() {
543			setTimeout(function() {
544			this.processEvent(this.queue.get());
545
546			document.getElementsByClassName('events-remaining-value')[0].textContent = this.queue.count();
547
548			this.loop();
549			}.bind(this), Math.floor(Math.random() * 1000) + 500);
550			};
551
552			Application.prototype.processEvent = function(event) {
553			if (!event.getMessage()) {
554			return;
555			}
556
557			if (event.getType() === 'IssuesEvent' \|\| event.getType() === 'IssueCommentEvent') {
558			this.audio.playClav(event.getMessage().length * 1.1);
559			} else if(event.getType() === 'PushEvent') {
560			this.audio.playCelesta(event.getMessage().length * 1.1);
561			}else{
562			this.audio.playSwell();
563			}
564
565			this.gui.drawEvent(event);
566			};
567
568			return Application;
569			}(window, jQuery));
570
571			$(function() {
572			new GitAmp().run();
573			});
574

ekinhbayar / gitamp

Push — master ( 9fa866...b60087 )

main.js ➔ Event A

Complexity

Size

Duplication

Importance

Duplication Side-by-Side

Filter issues like